@import '../../../css/colorVar.less';

.cell {
  margin-right: 9px;
}

.cellUp {
  margin-right: 9px;
  color: @text_red;
}

.cellDown {
  margin-right: 9px;
  color: @text_green;
}

.titleStyle {
  background: @section_bg;
  border-radius: 2px;
  box-shadow: 0 2px 3px 0 @section_shadow;
  padding-top: 15px;
  padding-bottom: 5px;

  .radio {
    color: @text_main !important;
    font-size: 14px !important;
    margin-left: 20px;
    margin-top: 12px;
  }
}

.card {
  border-radius: 4px;
  border: 1px solid rgba(67, 118, 255, 20%);
  // margin: '0 20px',
  height: 40px;
  line-height: 38px;

  .proportionbg1 {
    height: 6px;
    background: rgba(67, 118, 255, 10%);
    border-radius: 3px;
    margin-top: 18px;

    .proportion {
      background: linear-gradient(270deg, #96bcff 0%, #4376ff 100%);
    }
  }

  .proportionbg2 {
    height: 6px;
    background: rgba(244, 66, 58, 10%);
    border-radius: 3px;
    margin-top: 18px;

    .proportion {
      background: linear-gradient(270deg, rgba(244, 66, 58, 50%) 0%, rgba(244, 66, 58, 80%) 100%);
    }
  }
}

.asset1,
.market1 {
  display: flex;
  justify-content: space-between;
  > div {
    width: ~' calc(50% - 10px)';
  }
}
.asset2 {
  display: flex;
  justify-content: space-between;
  > div:first-child {
    width: ~'calc(40% - 10px)';
  }
  > div:last-child {
    width: ~'calc(60% - 10px)';
  }
}
.market2 {
  > div:last-child {
    margin-top: 20px;
  }
}
